import React, { PureComponent } from 'react'
import { View } from '@tarojs/components'
import { getPlatform } from '@UTILS/common'
import './FeedCardPlaceholder.scss'
const { isRN } = getPlatform()
export default class FeedCardPlaceholder extends PureComponent {
  renderCard = () => {
    const {
      count = 1, style = {}, width, height
    } = this.props
    const viewStyle = isRN ? { width, height, ...style } : { width: `${width}px`, height: `${height}px`, ...style }
    return [...Array(count)].map((item, index) => (
      <View className="feedCardPlaceholder" style={viewStyle} key={index.toString()}>
        <View className="title-container">
          <View className="row skeleton-blink" />
          <View className="row skeleton-blink" />
          <View className="row skeleton-blink row-half" />
        </View>
        <View className="coverImage skeleton-blink" />
      </View>
    ))
  }

  render() {
    return (
      <View className="feedCardPlaceholderContainer">
        {this.renderCard()}
      </View>
    )
  }
}
